<template>
  <el-form :inline="true" :model="formInline" class="demo-form-inline">
    <el-form-item label="配种日期：">
      <el-date-picker
        v-model="formInline.birthDate"
        type="date"
        placeholder="请选择日期"
        style="width: 150px"
      />--
      <el-date-picker
        v-model="formInline.birthDate"
        type="date"
        placeholder="请选择日期"
        style="width: 150px"
      />
    </el-form-item>
    <el-form-item label="种母耳号：">
      <el-input v-model="formInline.motherEarNumber" placeholder="请输入种母耳号" />
    </el-form-item>
    <el-form-item>
      <el-button type="danger" @click="getData">查询</el-button>
      <el-button>重置</el-button>
    </el-form-item>
  </el-form>
  <el-button type="danger" @click="getAdd" style="margin-bottom: 10px;">+新增</el-button>
  <el-button type="danger" disabled style="margin-bottom: 10px;">删除</el-button>
  <el-table
    :data="tableData"
    border
    style="width: 100%"
    @selection-change="handleSelectionChange"
  >
    <el-table-column type="selection" width="55" />
    <el-table-column
      prop="pigHistoryId"
      label="序号"
      align="center"
      width="80px"
    />
    <el-table-column
      prop="motherEarNumber"
      label="单据号"
      align="center"
      width="100px"
    />
    <el-table-column
      prop="breedingDate"
      label="采购日期"
      sortable
      align="center"
      width="180px"
    >
      <template #default="scoped">
        {{ scoped.row.breedingDate.substr(0, 19).replace("T", " ") }}
      </template>
    </el-table-column>
    <el-table-column prop="fatherEarNumber" label="核算单元" align="center" width="100px" />
    <el-table-column
      prop="pregnancycheckDate"
      label="类别"
      align="center"
      width="180px"
    >
      <template #default="scoped">
        {{ scoped.row.pregnancycheckDate.substr(0, 19).replace("T", " ") }}
      </template>
    </el-table-column>
    <el-table-column prop="pregnancycheckResults" label="供应商" align="center" width="100px" />
    <el-table-column prop="deliveryDate" label="摘要" align="center" width="180px">
      <template #default="scoped">
        {{ scoped.row.deliveryDate.substr(0, 19).replace("T", " ") }}
      </template>
    </el-table-column>
    <el-table-column prop="healthyoffspringcount" label="批次/耳号" align="center" width="100px">
    </el-table-column>
    <el-table-column prop="healthyoffspringWeight" label="栋舍" align="center" width="100px" />
    <el-table-column prop="weakoffspringcount" label="转入栏位" align="center" width="100px" />
    <el-table-column prop="deformitiescount" label="性别" align="center" width="100px" />
    <el-table-column prop="stillbirthscount" label="阶段" align="center" width="100px" />
    <el-table-column prop="mummiescount" label="采购员" align="center" width="100px" />
    <el-table-column prop="teratomascount" label="仓库" align="center" width="100px" />
    <el-table-column prop="weaningDate" label="商品名称" align="center" width="180px">
      <template #default="scoped">
        {{ scoped.row.weaningDate.substr(0, 19).replace("T", " ") }}
      </template>
    </el-table-column>
    <el-table-column prop="weanedQuantity" label="入库数量" align="center" width="100px" />
    <el-table-column prop="weaningWeight" label="调整数量" align="center" width="100px" />
    <el-table-column prop="currentparity" label="结算数量" align="center" width="100px" />
    <el-table-column prop="currentparity" label="只均单价(元)" align="center" width="100px" />
    <el-table-column prop="currentparity" label="金额" align="center" width="100px" />
    <el-table-column prop="currentparity" label="单价折扣" align="center" width="100px" />
    <el-table-column prop="currentparity" label="结算金额" align="center" width="100px" />
    <el-table-column prop="" label="创建人" align="center" width="100px" />
    <el-table-column prop="" label="创建时间" align="center" width="100px" />
    <el-table-column prop="" label="修改人" align="center" width="100px" />
    <el-table-column prop="" label="修改时间" align="center" width="100px" />
    <el-table-column prop="" label="审核人" align="center" width="100px" />
    <el-table-column prop="" label="审核时间" align="center" width="100px" />
    <el-table-column label="操作" align="center">
      <template #default="scope">
        <el-button
          link
          type="primary"
          @click="handleEdit(scope.row.pigHistoryId)"
          >编辑</el-button
        >
        <el-button
          link
          type="primary"
          @click="handleDelete(scope.row.pigHistoryId)"
          >删除</el-button
        >
      </template>
    </el-table-column>
  </el-table>

  <!-- 分页 -->
  <table>
    <tr>
      <td>
        <el-pagination
          v-model:current-page="formInline.pageIndex"
          v-model:page-size="formInline.pageSize"
          :page-sizes="[3, 5, 8, 10]"
          :background="true"
          layout="total,slot, prev, pager, next"
          :total="formInline.totalCount"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          prev-text="上一页"
          next-text="下一页"
        >
          ，当前{{ formInline.pageIndex }}/{{
            formInline.pageCount
          }}页，每页显示{{ formInline.pageSize }}条
          <el-button
            class="btn-prev"
            link
            @click="handleCurrentChange(1)"
            :disabled="formInline.pageIndex == 1"
            >首页</el-button
          >
        </el-pagination>
      </td>
      <td>
        <el-pagination
          v-model:current-page="formInline.pageIndex"
          v-model:page-size="formInline.pageSize"
          :page-sizes="[3, 5, 8, 10]"
          :background="true"
          layout="slot, sizes,jumper"
          :total="formInline.totalCount"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          prev-text="上一页"
          next-text="下一页"
        >
          <el-button
            class="btn-prev"
            link
            @click="handleCurrentChange(formInline.pageCount)"
            :disabled="formInline.pageIndex == formInline.pageCount"
            >尾页</el-button
          >
        </el-pagination>
      </td>
    </tr>
  </table>
</template>

<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";
import { ElMessage,ElMessageBox } from "element-plus";
import axios from "axios";
import { useRouter, useRoute } from "vue-router";

const apiUrl = import.meta.env.VITE_APP_API_URL;
const apiBedinUrl = import.meta.env.VITE_APPRead_API_URL;

const router = useRouter();
const route = useRoute();

//多选
const multipleSelection = ref([]);
const handleSelectionChange = (val: any) => {
  multipleSelection.value = val;
};
//新增
const getAdd = () => {
  router.push("/MaleArchivesAdd");
};
//种猪历史
const formInline = reactive({
  birthDate: "",
  motherEarNumber: 0,
  pageIndex: 1,
  pageSize: 3,
  totalCount: 0,
  pageCount: 0,
});

const tableData = ref([]);
//种猪历史显示
const getData = () => {
  axios
    .post(apiBedinUrl+"/api/PigHistorys/SearchPigHistory", {
      pageIndex: formInline.pageIndex,
      pageSize: formInline.pageSize,
    })
    .then((res) => {
      console.log("猪只历史列表", res.data);
      tableData.value = res.data.data.list;
      formInline.pageCount = res.data.data.pageCount;
      formInline.totalCount = res.data.data.totalCount;
    });
};

//分页
const handleSizeChange = (val: number) => {
  console.log(`${val} items per page`);
  formInline.pageSize = val;
  getData();
};
const handleCurrentChange = (val: number) => {
  console.log(`current page: ${val}`);
  formInline.pageIndex = val;
  getData();
};
//编辑
const handleEdit = (pigHistoryId: number) => {
  console.log(pigHistoryId);
};
//删除
const handleDelete = (pigHistoryId: number) => {
  console.log(pigHistoryId);
  ElMessageBox.confirm("确认删除吗?", "警告", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      axios
        .post(apiBedinUrl+"/api/PigBreedings/DeletePigsBreeding", {
          pigHistoryId: pigHistoryId,
        })
        .then((res) => {
          console.log("种母历史删除", res.data.data);
          if (res.data.code == 0) {
            ElMessage.success("种母历史删成功");
            getData();
          } else {
            ElMessage.error("种母历史删失败");
          }
        });
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "已取消",
      });
    });
};
//生命周期钩子
onMounted(() => {
  getData();
});
</script>

<style scoped></style>
